<!doctype html>
<html lang="en">
<head>
    <title>Code coverage report for javascripts/explorev2/components/Filter.jsx</title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="../../../prettify.css" />
    <link rel="stylesheet" href="../../../base.css" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style type='text/css'>
        .coverage-summary .sorter {
            background-image: url(../../../sort-arrow-sprite.png);
        }
    </style>
</head>
<body>
<div class='wrapper'>
  <div class='pad1'>
    <h1>
      <a href="../../../index.html">All files</a> / <a href="index.html">javascripts/explorev2/components</a> Filter.jsx
    </h1>
    <div class='clearfix'>
      <div class='fl pad1y space-right2'>
        <span class="strong">64.29% </span>
        <span class="quiet">Statements</span>
        <span class='fraction'>18/28</span>
      </div>
      <div class='fl pad1y space-right2'>
        <span class="strong">25% </span>
        <span class="quiet">Branches</span>
        <span class='fraction'>4/16</span>
      </div>
      <div class='fl pad1y space-right2'>
        <span class="strong">100% </span>
        <span class="quiet">Functions</span>
        <span class='fraction'>3/3</span>
      </div>
      <div class='fl pad1y space-right2'>
        <span class="strong">64.29% </span>
        <span class="quiet">Lines</span>
        <span class='fraction'>18/28</span>
      </div>
    </div>
  </div>
  <div class='status-line medium'></div>
<pre><table class="coverage">
<tr><td class="line-count quiet">1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129</td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">6x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">2x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">2x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">2x</span>
<span class="cline-any cline-yes">2x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">2x</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">2x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">2x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">2x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">4x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React from 'react';
import Select from 'react-select';
import { Button } from 'react-bootstrap';
import SelectField from './SelectField';
&nbsp;
const propTypes = {
  actions: React.PropTypes.object.isRequired,
  filterColumnOpts: React.PropTypes.array,
  prefix: React.PropTypes.string,
  filter: React.PropTypes.object.isRequired,
  renderFilterSelect: React.PropTypes.bool,
  datasource_type: React.PropTypes.string.isRequired,
  datasource_id: React.PropTypes.number.isRequired,
};
&nbsp;
const defaultProps = {
  filterColumnOpts: [],
  prefix: 'flt',
};
&nbsp;
export default class Filter extends React.Component {
  constructor(props) <span class="branch-1 cbranch-no" title="branch not covered" >{</span>
    super(props);
    const opChoices = this.props.prefix === 'flt' ?
      ['in', 'not in'] : <span class="branch-1 cbranch-no" title="branch not covered" >['==', '!=', '&gt;', '&lt;', '&gt;=', '&lt;='];</span>
    this.state = {
      opChoices,
    };
  }
  componentWillMount() {
    <span class="missing-if-branch" title="else path not taken" >E</span>if (this.props.filter.col) {
      this.props.actions.fetchFilterValues(
        this.props.datasource_type,
        this.props.datasource_id,
        this.props.filter,
        this.props.filter.col);
    }
  }
  changeCol(filter, colOpt) {
    c</span>onst val = (<span class="cstat-no" title="statement not covered" >colOpt) ? colOpt.value : null;
<span class="cstat-no" title="statement not covered" >    this.props.actions.changeFilter(filter, 'col', val);</span>
<span class="cstat-no" title="statement not covered" >    if (val) {</span>
<span class="cstat-no" title="statement not covered" >      this.props.actions.fetchFilterValues(</span>
        this.props.datasource_type, this.props.datasource_id, filter, val);
    }
  }
  changeOp(filter, opOpt) {
    c</span>onst val = (<span class="cstat-no" title="statement not covered" >opOpt) ? opOpt.value : null;
<span class="cstat-no" title="statement not covered" >    this.props.actions.changeFilter(filter, 'op', val);</span>
  }
  changeValue(filter, event) {
<span class="cstat-no" title="statement not covered" >    this.props.actions.changeFilter(filter, 'value', event.target.value);</span>
  }
  changeSelectValue(filter, name, value) {
<span class="cstat-no" title="statement not covered" >    this.props.actions.changeFilter(filter, 'value', value);</span>
  }
  removeFilter(filter) {
<span class="cstat-no" title="statement not covered" >    this.props.actions.removeFilter(filter);</span>
  }
  renderFilterFormField() {
    <span class="missing-if-branch" title="if path not taken" >I</span>if (this.props.renderFilterSelect) {
<span class="cstat-no" title="statement not covered" >      return (</span>
        &lt;SelectField
          multi
          freeForm
          name="filter-value"
          value={this.props.filter.value}
          choices={this.props.filter.choices ? this.props.filter.choices : []}
          onChange={this.changeSelectValue.bind(this, this.props.filter)}
        /&gt;
      );
    }
    return (
      &lt;input
        type="text"
        onChange={this.changeValue.bind(this, this.props.filter)}
        value={this.props.filter.value}
        className="form-control input-sm"
        placeholder="Filter value"
      /&gt;
    );
  }
  render() {
    return (
      &lt;div&gt;
        &lt;div className="row space-1"&gt;
          &lt;Select
            className="col-lg-12"
            multi={false}
            name="select-column"
            placeholder="Select column"
            options={this.props.filterColumnOpts.map((o) =&gt; ({ value: o, label: o }))}
            value={this.props.filter.col}
            autosize={false}
            onChange={this.changeCol.bind(this, this.props.filter)}
          /&gt;
        &lt;/div&gt;
        &lt;div className="row space-1"&gt;
          &lt;Select
            className="col-lg-4"
            multi={false}
            name="select-op"
            placeholder="Select operator"
            options={this.state.opChoices.map((o) =&gt; ({ value: o, label: o }))}
            value={this.props.filter.op}
            autosize={false}
            onChange={this.changeOp.bind(this, this.props.filter)}
          /&gt;
          &lt;div className="col-lg-6"&gt;
            {this.renderFilterFormField()}
          &lt;/div&gt;
          &lt;div className="col-lg-2"&gt;
            &lt;Button
              id="remove-button"
              bsSize="small"
              onClick={this.removeFilter.bind(this, this.props.filter)}
            &gt;
              &lt;i className="fa fa-minus" /&gt;
            &lt;/Button&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    );
  }
}
&nbsp;
Filter.propTypes = propTypes;
Filter.defaultProps = defaultProps;
&nbsp;</pre></td></tr>
</table></pre>
<div class='push'></div><!-- for sticky footer -->
</div><!-- /wrapper -->
<div class='footer quiet pad2 space-top1 center small'>
  Code coverage
  generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Fri Jan 20 2017 17:03:25 GMT-0800 (PST)
</div>
</div>
<script src="../../../prettify.js"></script>
<script>
window.onload = function () {
        if (typeof prettyPrint === 'function') {
            prettyPrint();
        }
};
</script>
<script src="../../../sorter.js"></script>
</body>
</html>
